<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" class="dialogStyleBase" title="选择地区"
    width="90vw" :visible.sync="boxVisible" append-to-body :before-close="editBoxCancel">

    <!-- {{optionsQty}}<br /> -->

    <div class=" dialogStyleBaseBox">
        <div class=" main">
            <!-- 一级 -->
            <div class="item">
                <div class="title">省</div>
                <div class="list">
                    <!-- 时间问题未解决disable不为空时全选时会选中disable的数据现做临时判断方案  当一个都没选过（没有禁止disable 数据时）才可以全选操作 -->
                    <template v-if="$vFN.Utils.isEmpty(disable)">
                        <div class="li" @click="clearSelectAll();updataListData()"
                            v-if="optionsQty[0].checkAll==optionsQty[0].total">
                            <div
                                :class="'select '+(optionsQty[0].checkAll==optionsQty[0].total?'true':(optionsQty[0].checkAll>0?'true':'false'))">
                                <i v-if="optionsQty[0].checkAll==optionsQty[0].total" class="el-icon-check"></i>
                                <span
                                    v-if="optionsQty[0].checkAll>0&&optionsQty[0].checkAll!=optionsQty[0].total">{{optionsQty[0].checkAll}}</span>
                            </div>
                            <div class="name">取消全选</div>
                        </div>

                        <div class="li" @click="logic_addAll1([]);updataListData()" v-else>
                            <div
                                :class="'select '+(optionsQty[0].checkAll==optionsQty[0].total?'true':(optionsQty[0].checkAll>0?'true':'false'))">
                                <i v-if="optionsQty[0].checkAll==optionsQty[0].total" class="el-icon-check"></i>
                                <span
                                    v-if="optionsQty[0].checkAll>0&&optionsQty[0].checkAll!=optionsQty[0].total">{{optionsQty[0].checkAll}}</span>
                            </div>
                            <div class="name">全选</div>
                        </div>
                    </template>

                    <div :class="'li ' + (item.code == selectId[0])" :key="item.code" v-for="(item,index) in options"
                        @click="getCategoryOptions([item.code])">
                        <div :class="'select '+(item.checkAll?'true':(item.select>0?'true':'false'))+' '+(item.disable?'disable':'')"
                            @click="$event.cancelBubble = true;select(item,[item.code])">
                            <i v-if="item.checkAll" class="el-icon-check"></i>
                            <span v-if="item.select>0">{{item.select}}</span>
                        </div>
                        <div class="name">{{item.name}}</div>
                        <div class="code">{{item.code}}</div>
                        <div class="go"><i class="el-icon-arrow-right"></i></div>
                    </div>
                </div>
                <div class="kong" v-if="optionsQty[0].total<=0">暂无数据</div>
            </div>
            <div class="item" v-if="level >= 2">
                <div class="title">市</div>
                <!-- 二级 -->
                <div class="list" v-if="selectId.length>0">
                    <div :class="'li ' + (item.code == selectId[1])" :key="item.code"
                        v-for="(item,index) in options[selectId[0]].list"
                        @click="getCategoryOptions([selectId[0],item.code])">
                        <div :class="'select '+(item.checkAll?'true':(item.select>0?'true':'false'))+' '+(item.disable?'disable':'')"
                            @click="$event.cancelBubble = true;select(item,[selectId[0],item.code])">
                            <i v-if="item.checkAll" class="el-icon-check"></i>
                            <span v-if="item.select>0">{{item.select}}</span>
                        </div>
                        <div class="name">{{item.name}}</div>
                        <div class="code">{{item.code}}</div>
                        <div class="go"><i class="el-icon-arrow-right"></i></div>
                    </div>
                </div>
                <div class="kong" v-if="optionsQty[1].total<=0">暂无数据</div>
            </div>
            <div class="item" v-if="level >= 3">
                <div class="title">区县</div>
                <!-- 三级 -->
                <div class="list" v-if="selectId.length>1">
                    <div :class="'li ' + (item.code == selectId[2])" :key="item.code"
                        v-for="(item,index) in options[selectId[0]].list[selectId[1]].list"
                        @click="getCategoryOptions([selectId[0],selectId[1],item.code])">
                        <div :class="'select '+(item.checkAll?'true':(item.select>0?'true':'false'))+' '+(item.disable?'disable':'')"
                            @click="$event.cancelBubble = true;select(item,[selectId[0],selectId[1],item.code])">
                            <i v-if="item.checkAll" class="el-icon-check"></i>
                            <span v-if="item.select>0">{{item.select}}</span>
                        </div>
                        <div class="name">{{item.name}}</div>
                        <div class="code">{{item.code}}</div>
                        <div class="go"><i class="el-icon-arrow-right"></i></div>
                    </div>
                </div>
                <div class="kong" v-if="optionsQty[2].total<=0">暂无数据</div>
            </div>
            <div class="item" v-if="level == 4">
                <div class="title">乡镇街道</div>
                <!-- 四级 -->
                <div class="list" v-if="selectId.length>2">
                    <div :class="'li ' + (item.code == selectId[3])" :key="item.code"
                        v-for="(item,index) in options[selectId[0]].list[selectId[1]].list[selectId[2]].list">
                        <div :class="'select '+(item.checkAll?'true':(item.select>0?'true':'false'))+' '+(item.disable?'disable':'')"
                            @click="$event.cancelBubble = true;select(item,[selectId[0],selectId[1],selectId[2],item.code])">
                            <i v-if="item.checkAll" class="el-icon-check"></i>
                            <span v-if="item.select>0">{{item.select}}</span>
                        </div>
                        <div class="name">{{item.name}}</div>
                        <div class="code">{{item.code}}</div>
                    </div>
                </div>
                <div class="kong" v-if="optionsQty[3].total<=0">暂无数据</div>
            </div>



            <div class="item">
                <div class="title">已选省、市、区县，乡镇街道</div>
                <!-- 四级 -->
                <div class="selectList">


                    <div class="ul" v-for="(item,index) in list">
                        <div class="li">
                            <div class="border">
                                <div class="l l1"></div>
                                <div class="name">{{item.name}}</div>
                                <div class="del" @click="logic_del1([item.code]);updataListData()"><i
                                        class="el-icon-delete"></i></div>
                            </div>
                        </div>
                        <div class="ul" v-for="(iitem,iindex) in item.list">
                            <div class="li">
                                <div class="border">
                                    <div class="l l2"></div>
                                    <div class="name">{{iitem.name}}</div>
                                    <div class="del" @click="logic_del2([item.code,iitem.code]);updataListData()"><i
                                            class="el-icon-delete"></i></div>
                                </div>
                            </div>
                            <div class="ul" v-for="(iiitem,iiindex) in iitem.list">
                                <div class="li">
                                    <div class="border">
                                        <div class="l l3"></div>
                                        <div class="name">{{iiitem.name}}</div>
                                        <div class="del"
                                            @click="logic_del3([item.code,iitem.code,iiitem.code]);updataListData()"><i
                                                class="el-icon-delete"></i></div>
                                    </div>
                                </div>
                                <div class="ul" v-for="(iiiitem,iiiindex) in iiitem.list">
                                    <div class="li">
                                        <div class="border">
                                            <div class="l l4"></div>
                                            <div class="name">{{iiiitem.name}}</div>
                                            <div class="del"
                                                @click="logic_del4([item.code,iitem.code,iiitem.code,iiiitem.code]);updataListData()">
                                                <i class="el-icon-delete"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="kong" v-if="optionsQty[0].selected<=0">暂无已选数据</div>
            </div>

        </div>
    </div>




    <!-- <div style="display: none;">{{list}}<br /></div> -->
    <div slot="footer" class="footer">
        <el-button @click="editBoxCancel()">取 消</el-button>
        <el-button type="primary" @click="submit()" :disabled="optionsQty[0].selected<=0">保存</el-button>
    </div>
</el-dialog>